<template>
    <div class="my-list">
        <van-list v-model="isLoading" :finished="isEnd" finished-text="没有更多了..." :offset="40">
            <card :info="item" v-for="(item, index) in list" :key="index" />
        </van-list>
    </div>
</template>
<script>
    import Card from "./card-info";
    import { getCombinationList } from "@/api/v1/product";
    import { pagination } from "@/utils/enumConfig";

    export default {
        props: {
            type: {
                type: String,
                default: "基金",
            },
        },
        data() {
            return {
                pagination: this.$_.cloneDeep(pagination),
                list: [],
                bannerList: [],
                isEnd: false,
                isEmpty: false,
                isLoading: false,
            };
        },
        components: {
            Card,
        },
        async created() {
            await this.getCombinationList(this.pagination);
        },
        methods: {
            // async onLoad() {
            //   let { current } = this.pagination;
            //   await this.getCombinationList({
            //     ...this.pagination,
            //   });
            // },
            async getCombinationList(pagination) {
                this.isLoading = true;
                let { size } = pagination;
                let list = await getCombinationList({
                    productType: this.type,
                    ...pagination,
                });
                if (list) {
                    this.list = this.list.concat(list);
                    this.pagination = {
                        ...pagination,
                        current: pagination.current + 1,
                    };
                    this.isEnd = list.length < size ? true : false;
                    this.isEmpty = list.length === 0 ? true : false;
                }
                this.isLoading = false;
            },
        },
    };
</script>
<style lang='scss' scoped>
    .my-list {
        padding-bottom: 20%;
        // height: 80vh;
        overflow: auto;
    }
</style>